<!DOCTYPE html>
<html lang="en">
{{template "header" .}}
<body>
<div>
    {{template "nav" .}}
    <div class="container">
        <div class="normal-container">
            <article id="messageToast" class="message is-danger" style="display: none">
                <div class="message-body" id="messageToastText">

                </div>
            </article>
            {{if not .files}}
            <div class="box">
                <div class="table-container">
                    <div class="box">
                        <article class="media">
                            <div class="media-content">
                                <div class="content">
                                    <div class="page-card-title" style="color: #AAAAAA;" id="imageUploadStatus">
                                        {{if .isQuery}}
                                        无匹配文件
                                        {{else}}
                                        当前无任何文件，请点击 <a class="button is-light" onclick="showUploadModal()">上传</a>
                                        按钮以上传文件.
                                        {{end}}
                                    </div>
                                </div>
                            </div>
                        </article>
                    </div>
                </div>
            </div>
            {{end}}
            {{template "progress"}}
            <div>
                {{range $index, $file := .files}}
                <div class="box file-box" id="file-{{$file.Id}}">
                    <article class="media">
                        <div class="media-content">
                            <div class="content">
                                <div class="page-card-title">
                                    <a onclick="displayFile('/upload/{{$file.Link}}')">{{$file.Filename}}</a>
                                </div>
                                <span class="tag is-light">{{$file.Uploader}}</span>
                                <span class="tag is-light">{{$file.Time}}</span>
                                <span class="tag is-light"
                                      id="counter-{{$file.Id}}">{{$file.DownloadCounter}} 次下载</span>
                                <div class="page-card-text">
                                    {{if $file.Description}}
                                    {{$file.Description}}
                                    {{else}}
                                    无描述信息
                                    {{end}}
                                </div>
                                <div class="actions">
                                    {{if $.username}}
                                    <span onclick="deleteFile({{$file.Id}}, '{{$file.Link}}')">
                                        <img src="/public/icon/delete.svg"/>
                                    </span>
                                    {{end}}
                                    <span onclick="showQRCode('/upload/{{$file.Link}}')">
                                        <img src="/public/icon/qrcode.svg"/>
                                    </span>
                                    <span onclick="copyLink('/upload/{{$file.Link}}')">
                                        <img src="/public/icon/copy.svg"/>
                                    </span>
                                    <a target="_blank" href="/upload/{{$file.Link}}">
                                        <img src="/public/icon/play.svg"/>
                                    </a>
                                    <a download="{{$file.Filename}}" href="/upload/{{$file.Link}}" onclick="updateDownloadCounter('counter-{{$file.Id}}')">
                                        <img src="/public/icon/download.svg"/>
                                    </a>
                                </div>
                            </div>
                        </div>
                    </article>
                </div>
                {{end}}
            </div>
            <nav class="pagination is-centered" role="navigation" aria-label="pagination">
                <a class="pagination-previous shadow" href="/?p={{.prev}}">上一页</a>
                <a class="pagination-next shadow" href="/?p={{.next}}">下一页</a>
            </nav>
        </div>
    </div>
    {{template "footer" .}}
</div>

{{template "modal"}}
{{template "notice" .}}

</body>
</html>
